<%--
  Created by IntelliJ IDEA.
  User: MECHREVO
  Date: 2021/4/2
  Time: 9:12
  To change this template use File | Settings | File Templates.
--%>
<%@ page isELIgnored="false" contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>Title</title>
    <link href="${pageContext.request.contextPath}/ui/layui/css/layui.css" type="text/css" rel="stylesheet"/>

    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.4.1.js"></script>
</head>





<body>



<div class="box">
    <ul class="layui-nav">
        <li class="layui-nav-item"><a href="">首页</a></li>

        <li class="layui-nav-item"><a href="${pageContext.request.contextPath}/demandhall">需求大厅</a></li>
        <li class="layui-nav-item" style="margin-left: 1532px;">
            <a href="javascript:;">${userinfo.userName}</a>
            <dl class="layui-nav-child">
                <dd><a href="${pageContext.request.contextPath}/updateInfo?userId=${userinfo.userId}">基本信息</a></dd>
                <dd><a href="">安全管理</a></dd>

            </dl>
        </li>
        <li class="layui-nav-item"><a href="${pageContext.request.contextPath}/WEB-INF/jsp/login.jsp">退出</a></li>
    </ul>
    <div style="height: 100%;width: 50px;">
        <ul class="layui-nav layui-nav-tree layui-inline" lay-filter="demo" style="margin-right: 10px;">
            <li class="layui-nav-item layui-nav-itemed">
                <a href="javascript:;">默认展开</a>
                <dl class="layui-nav-child">
                    <dd><a href="javascript:;">选项一</a></dd>
                    <dd><a href="javascript:;">选项二</a></dd>
                    <dd><a href="javascript:;">选项三</a></dd>
                    <dd><a href="">跳转项</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;">解决方案</a>
                <dl class="layui-nav-child">
                    <dd><a href="">移动模块</a></dd>
                    <dd><a href="">后台模版</a></dd>
                    <dd><a href="">电商平台</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item"><a href="">云市场</a></li>
            <li class="layui-nav-item"><a href="">社区</a></li>
        </ul>
    </div>



    <form class="layui-form" action="${pageContext.request.contextPath}/updateinfo" method="post">
        <input type="hidden" name="pkId" value="${userinfo.pkId}">
        <input type="hidden" name="userId" value="${userinfo.userId}">

        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-inline">
                    <input type="text" name="userName"  autocomplete="off" class="layui-input" value="${userinfo.userName}">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">年龄</label>
                <div class="layui-input-inline">
                    <input type="text" name="age"  autocomplete="off" class="layui-input" value="${userinfo.age}">
                </div>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">性别</label>
            <div class="layui-input-block">
                <input type="radio" name="sex" value="m" title="男" <c:if test="${userinfo.sex =='m'}"> checked </c:if>>
                <input type="radio" name="sex" value="f" title="女" <c:if test="${userinfo.sex =='f'}"> checked </c:if>>

            </div>
        </div>



        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">手机号</label>
                <div class="layui-input-inline">
                    <input type="text" name="phoneNum" lay-verify="required|phone" autocomplete="off" class="layui-input" value="${userinfo.phoneNum}">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">身高</label>
                <div class="layui-input-inline">
                    <input type="text" name="height" id="date"   autocomplete="off" class="layui-input" value="${userinfo.height}">
                </div>
            </div>

        </div>




        <div class="layui-form-item">
            <label class="layui-form-label">工作地址</label>
            <div class="layui-input-inline">
                <select name="workProvinceid"  onclick="provines()" id="provinceid"  lay-filter="provinceid" >



                </select>
            </div>
            <div class="layui-input-inline">
                <input type="hidden" value="${pageContext.request.contextPath}" id="contextPath">
                <select name="workCityid" id="cities" onchange="cChange()" lay-filter="cities">



                </select>
            </div>
            <div class="layui-input-inline">
                <select name="workAreaid" id="selectArea" onchange="aChange()" lay-filter="areas">


                </select>
            </div>

        </div>


        <div class="layui-inline">
            <label class="layui-form-label">详细地址</label>
            <div class="layui-input-inline">
                <input type="text" name="workAddrDetail"  autocomplete="off" class="layui-input" value="${userinfo.workAddrDetail}">
            </div>
        </div>


        <br>
        <div class="layui-form-item">
            <label class="layui-form-label">家庭地址</label>
            <div class="layui-input-inline">
                <select name="homeProvinceid" id="homeprovinceid" lay-filter="provinceid1" >

                </select>
            </div>
            <div class="layui-input-inline">
                <select name="homeCityid" id="homecities" lay-filter="cities1">

                </select>
            </div>
            <div class="layui-input-inline">
                <select name="homeAreaid" lay-filter="areas" id="homeareasid">

                </select>
            </div>

        </div>


        <div class="layui-inline">
            <label class="layui-form-label">详细地址</label>
            <div class="layui-input-inline">
                <input type="text" name="homeAddrDetail"  autocomplete="off" class="layui-input" value="${userinfo.homeAddrDetail}">
            </div>
        </div>
        <br>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>




</div>

<script src="${pageContext.request.contextPath}/ui/layui/layui.js"></script>
<script>

    $(document).ready(function(){


        layui.use('form',function (){
            var form=layui.form;
            $.ajax({

                type:"post",
                url:"${pageContext.request.contextPath}/updatedanInfo1",
                dataType:"json",
                async:true,
                contentType:"application/json;charset=utf-8",
                success:function(data){
                    var element='';
                    for(var i=0;i<data.length;i++){
                        element+=" <option value='" + data[i].provinceid + "'>" + data[i].province + "</option>";
                    }

                    $("#provinceid").html(element);
                    $("#homeprovinceid").html(element);
                    form.render('select');
                },
                error:function(data,errrorMessage,e){
                    alert("服务器异常，请重试");
                }
            });

        })

    })






    layui.use('form',function (){
        var form=layui.form;

        form.on('select(provinceid)',function (provincedata){

            var url=$("#contextPath").val()+"/citiesquan";

            $.ajax({
                type:"post",
                url:url,
                data:JSON.stringify({
                    "provinceid":provincedata.value
                }),
                dataType:"json",
                async:true,
                contentType:"application/json;charset=utf-8",
                success:function(data){
                    var element='';
                    for(var i=0;i<data.length;i++){
                        element+=" <option value='" + data[i].cityid + "'>" + data[i].city + "</option>";
                    }

                    $("#cities").html(element);
                    $("#homecities").html(element);
                    form.render('select');
                },

            });
            console.log("success")
        })

    })







    layui.use('form',function (){
        var form=layui.form;

        form.on('select(cities)',function (Cityadte){

            var url=$("#contextPath").val()+"/arasquan";

            $.ajax({
                type:"post",
                url:url,
                data:JSON.stringify({
                    "cityid":Cityadte.value
                }),
                dataType:"json",
                async:true,
                contentType:"application/json;charset=utf-8",
                success:function(data){
                    var element='';
                    for(var i=0;i<data.length;i++){
                        element+=" <option value='" + data[i].areaid + "'>" + data[i].area + "</option>";
                    }

                    $("#selectArea").html(element);
                    $("#homeareasid").html(element);
                    form.render('select');
                },

            });
            console.log("success")
        })

    })




    layui.use('form',function (){
        var form=layui.form;

        form.on('select(provinceid1)',function (provincedata){

            var url=$("#contextPath").val()+"/citiesquan";

            $.ajax({
                type:"post",
                url:url,
                data:JSON.stringify({
                    "provinceid":provincedata.value
                }),
                dataType:"json",
                async:true,
                contentType:"application/json;charset=utf-8",
                success:function(data){
                    var element='';
                    for(var i=0;i<data.length;i++){
                        element+=" <option value='" + data[i].cityid + "'>" + data[i].city + "</option>";
                    }

                    $("#homecities").html(element);
                    form.render('select');
                },

            });
            console.log("success")
        })

    })







    layui.use('form',function (){
        var form=layui.form;

        form.on('select(cities1)',function (Cityadte){

            var url=$("#contextPath").val()+"/arasquan";

            $.ajax({
                type:"post",
                url:url,
                data:JSON.stringify({
                    "cityid":Cityadte.value
                }),
                dataType:"json",
                async:true,
                contentType:"application/json;charset=utf-8",
                success:function(data){
                    var element='';
                    for(var i=0;i<data.length;i++){
                        element+=" <option value='" + data[i].areaid + "'>" + data[i].area + "</option>";
                    }


                    $("#homeareasid").html(element);
                    form.render('select');
                },

            });
            console.log("success")
        })

    })







</script>
</body>

</html>
